<!--
 * @FileDescription: el-select 的封装，去掉了边框，只有文本+箭头; 注意依然需要使用 el-option
 -->
<script setup lang="ts"></script>

<template>
  <el-select class="select_text" v-bind="$attrs">
    <template v-for="(_, key) in $slots" #[key]="slotProps" :key="key">
      <slot :name="key" v-bind="slotProps"></slot>
    </template>
  </el-select>
</template>

<style scoped>
.select_text {
  display: flex;
  align-items: center;
  justify-content: center;
}

.select_text :deep(.el-select__wrapper) {
  flex: 1;
  box-shadow: none;
  min-height: 0;
  padding: 0;
  gap: 0;
}

.select_text :deep(.el-select__placeholder) {
  transform: translateY(-55%);
}
</style>
